<!--
 * @Author: Bennty
 * @Date: 2024-10-09 15:01:17
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2024-10-09 15:35:38
 * @Description: 请填写简介
-->
<template>
    <el-dialog v-model="props.visible" title="更换刀版" width="40%" @close="handleClose" destory-on-close>
        <el-row>
            <el-col :span="7">
                <span>{{ `刀线名称：${props.data.knifePlateName}` }}</span>
            </el-col>
            <el-col :span="7">
                <span>{{ `刀版名称：${props.data.knifePlateName}` }}</span>
            </el-col>
            <el-col :span="5">
                <span>{{ `刀版使用上限：${props.data.knifeLimit}` }}</span>
            </el-col>
            <el-col :span="5">
                <span>{{ `刀版目前使用次数：${props.data.useNumber}` }}</span>
            </el-col>
        </el-row>
        <el-form ref="formRef" :model="formData" style="margin-top: 20px">
            <el-form-item label="新刀版名称" prop="newKnifeName">
                <el-row>
                    <el-col :span="24">
                        <el-input v-model="formData.newKnifeName" placeholder="请输入"></el-input>
                    </el-col>
                </el-row>
            </el-form-item>
            <el-form-item label='新刀版价格' prop="newKnifeAmount">
                <el-row>
                    <el-col :span="24">
                        <el-input type="number" v-model="formData.newKnifeAmount" placeholder="请输入"></el-input>
                    </el-col>
                </el-row>
            </el-form-item>
        </el-form>
        <span class="tips">
            {{ `当前刀版使用次数${props.data.useNumber}，如果更换刀版会使当前刀版直接报废，使用次数从0开始重新计算，您确定吗？` }}
        </span>
        <template #footer>
            <div class="dialog-footer">
                <el-button  type="primary" @click="onSubmit">确 定</el-button>
                <el-button @click="handleClose">取 消</el-button>
            </div>
        </template>
    </el-dialog>
</template>

<script setup lang="ts">
import type { FormInstance } from 'element-plus';
import { replaceKnifeModelApi } from '@/api/sj/warehouse/knifeModel';

const props = defineProps(['visible','types','tags','data']);
const emits = defineEmits(['close','submit']);
const formRef = ref<FormInstance>();

const formData = ref({
    id: undefined,
    newKnifeName: undefined,
    newKnifeAmount: undefined
});

const onSubmit = async () => {
    formData.value.id = props.data.id;
    const { code } = await replaceKnifeModelApi({...formData.value});
    if(code == 200){
        emits('submit', true);
        handleClose();
    }else{
        emits('submit', false);
    }
};

const handleClose = () => {
    emits('close');
    
};
</script>

<style scoped>
.tips{
    color: red;
    display: block
}
.dialog-footer{
    display: flex;
    justify-content: center;
}
</style>
